<template>
  <el-dialog
    v-model="visibility"
    width="65%"
    :title="config.button.text.view"
    append-to-body
    draggable
    :close-on-click-modal="false">
    <el-descriptions
      :column="appStore.column"
      border>
      <el-descriptions-item label="提货主体公司简称"> {{ props.rowData.baseCompanySimpleName }} </el-descriptions-item>
      <el-descriptions-item label="资金仓库简称"> {{ props.rowData.baseCapitalWarehouseName }} </el-descriptions-item>
      <el-descriptions-item label="商品简称"> {{ props.rowData.baseRiceBarnGoodsSimpleName }} </el-descriptions-item>
      <el-descriptions-item label="采购订单名称"> {{ props.rowData.purchaseOrderName }} </el-descriptions-item>
      <el-descriptions-item label="提货人"> {{ props.rowData.pickUserRealName }} </el-descriptions-item>
      <el-descriptions-item label="提货日期"> {{ props.rowData.pickDate }} </el-descriptions-item>
      <el-descriptions-item label="车次号"> {{ props.rowData.trainNumber }} </el-descriptions-item>
      <el-descriptions-item label="提货完整吨数"> {{ props.rowData.pickIntactTon }} </el-descriptions-item>
      <el-descriptions-item label="提货破损吨数"> {{ props.rowData.pickWornTon }} </el-descriptions-item>
      <el-descriptions-item label="提货应付款"> {{ props.rowData.pickPayPrice }} </el-descriptions-item>
      <el-descriptions-item label="仓储服务费"> {{ props.rowData.warehouseServicePrice }} </el-descriptions-item>
      <el-descriptions-item label="预付款天数"> {{ props.rowData.firstPayDayCount }} </el-descriptions-item>
      <el-descriptions-item label="尾款天数"> {{ props.rowData.endPayDayCount }} </el-descriptions-item>
      <el-descriptions-item label="预付款提货费利息"> {{ props.rowData.firstPayPickInterestPrice }} </el-descriptions-item>
      <el-descriptions-item label="尾款提货费利息"> {{ props.rowData.endPayPickInterestPrice }} </el-descriptions-item>
      <el-descriptions-item label="提货-我司预付款"> {{ props.rowData.pickCompanyFirstPayPrice }} </el-descriptions-item>
      <el-descriptions-item label="手动-我司预付款"> {{ props.rowData.manualCompanyFirstPayPrice }} </el-descriptions-item>
      <el-descriptions-item label="总计-我司预付款"> {{ props.rowData.sumCompanyFirstPayPrice }} </el-descriptions-item>
      <el-descriptions-item label="提货单价"> {{ props.rowData.pickUnitPrice }} </el-descriptions-item>
      <el-descriptions-item label="采购总价"> {{ props.rowData.pickTotalPrice }} </el-descriptions-item>
      <el-descriptions-item label="提货应付款"> {{ props.rowData.pickPayPrice }} </el-descriptions-item>
      <el-descriptions-item label="创建人"> {{ props.rowData.createUserRealName }} </el-descriptions-item>
      <el-descriptions-item label="创建时间"> {{ formatDateTime(props.rowData.createTime) }} </el-descriptions-item>
      <el-descriptions-item label="修改人"> {{ props.rowData.updateUserRealName }} </el-descriptions-item>
      <el-descriptions-item label="上次修改时间"> {{ formatDateTime(props.rowData.updateTime) }} </el-descriptions-item>
      <el-descriptions-item label="备注"> {{ props.rowData.remark }} </el-descriptions-item>
    </el-descriptions>
    <template #footer>
      <div>
        <el-button
          v-if="appStore.isPhone"
          @click="getBillLading"
          type="warning">
          生成提货单
        </el-button>
        <el-button
          v-if="appStore.isPhone"
          @click="editInfo">
          {{ config.button.text.edit }}
        </el-button>
        <el-button @click="visibility = false">{{ config.button.text.close }}</el-button>
      </div>
    </template>
  </el-dialog>
</template>

<script setup>
import { ref } from "vue";
import config from "@/common/element-plus/config";
import { useAppStore } from "@/stores/app"
import { formatDateTime } from "@/common/utils/date";

const appStore = useAppStore()

const visibility = ref(false)

const props = defineProps(["rowData"])

const emits = defineEmits(["editInfo","pickUp"])
const editInfo = () => {
  visibility.value=false;
  emits("editInfo",props.rowData);
}

const getBillLading = () => {
  visibility.value=false;
  emits("pickUp",[props.rowData.id]);
}

defineExpose({ visibility })
</script>

<style lang="scss" scoped>
:deep(.el-descriptions__label) {
  width: 110px;
}
:deep(.el-descriptions__cell:nth-child(1)) {
  min-width: 140px !important;
}
:deep(.el-descriptions__cell:nth-child(3)) {
  min-width: 140px !important;
}
:deep(.el-descriptions__cell:nth-child(5)) {
  min-width: 150px !important;
}
</style>